<template>
  <div class="shop-invite-wrap">
    <div class="shop-invite-phone">
      <div class="shop-invite-phone-box">
        <span class="shop-invite-title">手机号</span>
        <div class="shop-invite-phone-con">
          <input type="text" class="phone-num" placeholder="请输入您邀请的店员手机号" maxlength="11" v-model="phone"/>
        </div>
      </div>
    </div>

    <div class="invite-tip">温馨提示：邀请店员需对方同意，才能邀请成功</div>

    <button class="invite-sure-text" type="button" @click="inviteShopAssistant">确&nbsp;&nbsp;定</button>
  </div>
</template>

<script>
  import {inviteShopUser} from "../../../axios/api";
  import {checkPhone} from "../../../config/verify";

  export default {
    data() {
      return {
        userMark: "",
        phone: ""
      }
    },
    created() {
      let base64 = require('js-base64').Base64;
      this.userMark = base64.decode(sessionStorage.getItem("userMark"));
    },
    methods: {
      inviteShopAssistant() {
        if (checkPhone(this.phone)) {
          this.$vux.loading.show({
            text: '加载中',
          });
          let params = {
            "sgin": this.userMark,
            "userTel": this.phone
          };
          inviteShopUser(params).then((res) => {
            this.$vux.loading.hide();
            if (res.code == 0) {
              if (res.data == 1) {
                this.$router.push("/assistantList");
              } else {
                this.$vux.toast.text("邀请店员失败，请重试", "middle");
              }
            } else {
              this.$vux.toast.text(res.msg, "middle");
            }
          });
        }
      }
    }
  }
</script>

<style lang="less" scoped>
  @import "../../../assest/mixin";

  .shop-invite-wrap {
    .wh(100%, 100%);
    background: @talent-theme-bg-color;
    .shop-invite-phone {
      .wh(100%, 1.333rem);
      background: #FFF;
      .shop-invite-phone-box {
        margin-left: 0.32rem;
        display: flex;
        align-items: center;
        .wh(96.8%, 1.333rem);
        .shop-invite-title {
          .size-color(0.427rem, rgba(51, 51, 51, 1));
        }
        .shop-invite-phone-con {
          width: 60%;
          margin-left: 0.507rem;
          .phone-num {
            width: 100%;
            .size-color(0.427rem, #333)
          }
        }
      }
    }
    .invite-tip {
      padding-top: 0.32rem;
      padding-bottom: 1.2rem;
      padding-left: 0.32rem;
      .size-color(0.373rem, rgba(60, 175, 255, 1));
    }
    .invite-sure-text {
      .fj(center, center);
      margin: 0 auto;
      .wh(9.04rem, 1.333rem);
      background: rgba(60, 175, 255, 1);
      border-radius: 0.107rem;
      .size-color(0.48rem, rgba(255, 255, 255, 1));
    }
  }
</style>
